<template>
	<view>
		<view class="box">
			<view class="title">充值金额 <text style="font-size: 22rpx;color: gray;margin-left: 5rpx;"></text>
			</view>
			<view class="input_box">
				<text style="font-size: 60rpx; font-weight: 600;">￥</text>
				<u--input border="none" v-model="amount" type="digit" fontSize="96rpx" color="#000" class="input">
				</u--input>
			</view>
		</view>
		<view class="submitBtn" @click="submitRecharge">确认充值</view>

	</view>
</template>

<script>
	import {
		walletRecharge
	} from '@/config/api.js'
	export default {
		data() {
			return {
				amount: ''
			};
		},
		methods: {
			async submitRecharge() {
				if (!this.amount) {
					uni.showToast({
						icon: 'none',
						title: '请输入充值金额'
					})
					return
				}
				const res = await walletRecharge({
					amount: this.amount,
					type: 'wechat',
					method: 'miniapp'
				})
				if (!res.package) {
					uni.showToast({
						icon: 'none',
						title: res.msg
					})
					return
				}

				uni.hideLoading()
				// 请求支付
				uni.requestPayment({
					provider: 'wxpay', //支付类型-固定值
					timeStamp: res.timeStamp, // 时间戳（单位：秒）
					nonceStr: res.nonceStr, // 随机字符串
					package: res.package, // 固定值
					signType: res.signType, //固定值
					paySign: res.paySign, //签名
					success: res => {

						uni.showToast({
							icon: 'none',
							title: '充值成功',
							complete: () => {
								uni.reLaunch({
									url: './my'
								})
							}
						})
					},
					fail: err => {
						// console.log(err)
						uni.showToast({
							icon: 'none',
							title: '充值失败',
							complete: () => {

							}
						})
					}
				});

			},
		}
	}
</script>
<style>
	page {
		background-color: #f6f6f6;
	}
</style>
<style lang="scss" scoped>
	.box {
		background-color: #fff;
		border-radius: 10rpx;
		padding: 20rpx 30rpx;
		margin: 30rpx 20rpx 0;

		.title {
			font-size: 28rpx;
			color: #000;
		}

		.input_box {
			display: flex;
			align-items: center;
			margin-top: 20rpx;
			padding-bottom: 20rpx;
			border-bottom: 1px solid #eee;
			font-weight: 600;
			margin-bottom: 30rpx;

			/deep/.u-input__content__field-wrapper__field {
				height: 120rpx;
			}
		}


	}

	.submitBtn {
		width: 710rpx;
		height: 88rpx;
		background: #ff820d;
		border-radius: 10rpx;
		text-align: center;
		line-height: 88rpx;
		margin: 80rpx 20rpx 0;
		font-size: 28rpx;
		color: #fff;
	}
</style>